<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + 	request.getServerPort() + request.getContextPath() + "/";
%>

<!DOCTYPE html>
<html>
<head>
	<base href="<%=basePath%>">
	<meta charset="UTF-8">
<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
<script>
	$(function () {
		//将当前窗口设置为顶层窗口
		if(window.top!=window){
			window.top.location=window.location

		}

		//页面加载完毕，将用户文本框的信息清空
		$("#loginAct").val("");
		//在页面加载完毕，让用户的文本框自动获得焦点
		$("#loginAct").focus();


		//给按钮绑定事件，去完成登录操作
		$("#submitBtn").click(function () {
			login()
		})
		//给当前登录页面绑定键盘事件
		//event这个参数可以取得我们敲的是哪个键
		$(window).keydown(function (event) {
		//回车键的码值是13，event.keyCode获取我们所敲键的码值
			if(event.keyCode==13){
				login()
			}
		})
	})

	//普通的自定义的function方法要写在$function(){}在外面
	function login() {
		//开始进行登录验证
		//1.验证账号和密码
		//将本文左右的空格去除，使用$.trim(文本)
		var acoount=$.trim($("#loginAct").val())
		var password=$.trim($("#loginPwd").val())

		if(acoount==""||password==""){
			$("#msg").html("账号或者密码不能为空")
			//如果账号或者密码为空，则需要终止方法，不能继续往下走了
			return false;
		}
		//走到这说明账号和密码都不为空
		//现在开始走后端数据库来验证账号和密码的正确性
		$.ajax({
			url:"/crm/user/login",
			type:"post",
			data:{
				loginAct:acoount,
				loginPwd:password
			},
			dataType:"json",
			success:function (resp) {
				if(resp.success){
					window.location.href="workbench/index.jsp";
				}else {
					$("#msg").html(resp.msg)
				}
			}

		})
	}
</script>
</head>
<body>
	<div style="position: absolute; top: 0px; left: 0px; width: 60%;">
		<img src="image/IMG_7114.JPG" style="width: 100%; height: 90%; position: relative; top: 50px;">
	</div>
	<div id="top" style="height: 50px; background-color: #3C3C3C; width: 100%;">
		<div style="position: absolute; top: 5px; left: 0px; font-size: 30px; font-weight: 400; color: white; font-family: 'times new roman'">CRM &nbsp;<span style="font-size: 12px;">&copy;2021&nbsp;</span></div>
	</div>
	
	<div style="position: absolute; top: 120px; right: 100px;width:450px;height:400px;border:1px solid #D5D5D5">
		<div style="position: absolute; top: 0px; right: 60px;">
			<div class="page-header">
				<h1>登录fearless <%=basePath%></h1>
			</div>
			<form action="/workbench/index.jsp" class="form-horizontal" role="form">
				<div class="form-group form-group-lg">
					<div style="width: 350px;">
						<input class="form-control" type="text" placeholder="用户名" id="loginAct">
					</div>
					<div style="width: 350px; position: relative;top: 20px;">
						<input class="form-control" type="password" placeholder="密码" id="loginPwd">
					</div>
					<div class="checkbox"  style="position: relative;top: 30px; left: 10px;">
						
							<span id="msg" style="color: red"></span>
						
					</div>
					<!--表单中将按钮的类型设置为button就表示这只是一个按钮，不具备提交的操作-->
					<button type="button" id="submitBtn" class="btn btn-primary btn-lg btn-block"  style="width: 350px; position: relative;top: 45px;">登录</button>
				</div>
			</form>
		</div>
	</div>

</body>
</html>